@import "../../base/tools";
.record{
  background: #fff;
  @include pxToRem(padding,0,0,10px,0);
}
.record + .record{
  @include pxToRem(margin-top,$commonGap);
}
.record .title{
  position: relative;
  @include pxToRem(height,90px);
  display: flex;
  align-items: center;
  @include pxToRem(padding,0,30px);
}
.compare{
  @include pxToRem(padding,0,30px);
  display: flex;
  justify-content: space-between;
}
.compare .before{
  @include pxToRem(margin-right,15px);
}
.compare .before,
.compare .after{
  position: relative;
  width: 50%;
  border-radius: 4px;
  overflow: hidden;
  line-height: 0;
}
.compare .before i,
.compare .after i{
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom:0;
  right:0;
  background: rgba(0, 0, 0, .3);
  @include pxToRem(height,40px);
  @include pxToRem(width,100px);
  color: #f2f2f2;
  @include pxToRem(border-radius,20px, 0, 0, 0);
  font-size: 12px;
  font-weight: normal;
}
.compare .after i{
  background: rgba(29,161,242,.5);
}
.compare img{
  width: 100%;
  min-width: 100%;
  min-height: 4rem;
  background: #ccc;
}
.record h3{
  @include pxToRem(padding,0,30px);
  @include pxToRem(font-size,32px);
}
.record .tag{
  @include pxToRem(padding,10px,30px);
}
.record .tag em{
  font-style: normal;
  color: $tagColor;
  @include pxToRem(margin-right,10px);
  @include pxToRem(font-size,28px);
}
.record .static{
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: $lightFontColor;
  @include pxToRem(padding,0,30px);
}
.record .view{
  @include pxToRem(margin-right,30px);
}
.record .edit{
  @include pxToRem(height,90px);
  position: absolute;
  right: 0;
  top:0;
  display: flex;
  align-items: center;
  @include pxToRem(padding-right,30px);
  @include pxToRem(font-size,30px);
}
.record .new{
  @include pxToRem(padding-right,120px);
}